<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="css/mobile.css">
  <title>开具发票</title>
</head>

<body>
<div id="app" class="container">
  <div class="partOne">
    <div class="invoice-type">
      <span>发票类型</span>
      <p class="">
        <span style="border: solid 1px #1cc1d6;color:#1cc1d6;">电子普通发票</span>
        <span style="visibility: hidden;">增值税专用发票</span>
      </p>
    </div>

    <div class="tabChange">
      <span>抬头类型</span>
      <div @click="tabChange('企业')">
        <p>
          <span v-bind:class="{ selected:'企业'==invoiceType}"></span>
        </p>
        <span>企业</span>
      </div>
      <div @click="tabChange('个人')">
        <p>
          <span v-bind:class="{ selected:'个人'==invoiceType}"></span>
        </p>
        <span>个人/事业单位</span>
      </div>
    </div>
    <div v-if="invoiceType =='个人'" class="company-imfor">
      <div class="public-r">
        <span>发票抬头</span>
        <input type="text" v-model="purchaserName" placeholder="请输入抬头">
      </div>
    </div>
    <div v-if="invoiceType =='企业'" class="company-imfor">
      <div class="InvoiceRise">
        <span>发票抬头</span>
        <p>
          <input type="text" v-model="purchaserName" placeholder="请输入发票抬头" @keyup="searchCompanyTitleList">
          <i @click="dropDown"></i>
        </p>
        <div class="drop-down" v-if="dropDownShow">
          <p v-for="(item,index) in companyList" :key="index" @click="chooseCompanyTitle(index)"
             v-html="lineFeed(item)"></p>
        </div>
      </div>
      <div class="DutyParagraph public-r">
        <span>税号</span>
        <input type="text" placeholder="请输入税号" v-model="taxNumber">
      </div>
      <div class="public-r">
        <span>电话</span>
        <input type="text" placeholder="请输入电话" v-model="phone">
      </div>
      <div class="public-r">
        <span>地址</span>
        <input type="text" placeholder="请输入地址" v-model="address">
      </div>
      <div class="public-r">
        <span>开户行</span>
        <input type="text" placeholder="请输入开户行" v-model="purchaserBank">
      </div>
      <div class="public-r">
        <span>银行账号</span>
        <input type="text" placeholder="请输入开户行账号" v-model="purchaserBankAccount">
      </div>
    </div>
    <div class="invoice-content">
      <span>发票内容</span>
      <p>
        <span>商品明细</span>
        <span style="visibility: hidden;">商品类别</span>
      </p>
    </div>
  </div>
  <div class="titleReceive">
    <p>接收方式</p>
  </div>

  <div class="partTwo">
    <p>
      <span>手机号码</span>
      <input type="text" v-model="mobile" placeholder="请输入手机号码">
    </p>
    <p>
      <span>电子邮箱</span>
      <input type="text" v-model="email" placeholder="请输入电子邮箱">
    </p>
    <p>
      <a @click="saveAndUpload" id="submit" href="closeInvoiceDialog">提交</a>
    </p>
  </div>
</div>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<script src="https://cdn.bootcss.com/axios/0.19.0/axios.min.js"></script>
<script src="js/order.js"></script>
<script src="js/flexible.js"></script>
</body>

</html>
